<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>sougou.com</title>
    <style>
        *{
            list-style: none;
            padding: 0;
            margin: 0;
        }
        #wrap{
            width: 100%;
            height: 1500px;
            background: url(images/wrapper_bg.png);
            background-repeat: repeat-x;
        }
        #head{
            width: 1000px;
            height: 135px;
            margin-left: 175px;
        }
        #head1{
            width: 100%;
            height: 30px;
            margin-left: 70px;
        }
        .head1-1{
            width: 100px;
            height: 20px;
            font-size: 13px;
            float: left;
            margin-top: 5px;
            color: #999;
        }
        .head1-2{
            float: left;
            width: 43px;
            height: 25px;
        }
        #head2{
            width: 1000px;
            height: 70px;
            margin: 0 auto;
            position: relative;
        }
        #head2-1{
            float: left;
            width: 193px;
            height: 40px;
            margin-top: 15px;
            margin-left: 70px;
            position: absolute;
        }
        #head2-2{
            float: left;
            width: 325px;
            height: 32px;
            background: url(images/search_box.png);
            width: 325px;height: 32px;
            margin-top: 20px;
            margin-left: 850px;
            position: absolute;
        }
        #head3{
            width: 1000px;
            height: 30px;
            margin: 0 auto;
        }
        #head3 li{
            float: left;
            color: #fff;
            margin-top: 3px;
            margin-left: 100px;
        }
        #head3 li:hover{
            background-color: #e94f0d;
            cursor: pointer;
        }
        #banner{
            width: 1000px;
            height: 400px;
            margin: 0 auto;
            background: url(images/banner_7.5.1.jpg);
            position: relative;
        }
        #banner1{
            position: absolute;
            left: 540px;
            top: 240px;
        }
        #banner2{
            width: 273px;
            height: 70px;
            background:url(images/btn_down_pc_7.5.0.png);
            position: absolute;
            left:540px;
            top: 272px;
        }
        #banner2 :hover{
            cursor: pointer;
            background-position: 0 -70px;
        }
        #body{
            width: 1000px;
            height: 1000px;
            border: 1px red dashed;
            margin: 0 auto;
        }
        #left{
            width: 700px;
            height: 1000px;
            border: 1px red dashed;
            float: left;
        }
        #right{
            width: 290px;
            height: 1000px;
            border: 1px red dashed;
            float: left;
            margin-left: 5px;
        }
        #left1{
            width: 700px;
            height: 580px;
            border: 1px red dashed;
            background: url(images/side_title.png);
            background-repeat: no-repeat; 
        }
        .left1-1{
            width: 334px;
            height: 157px;
            background: url(images/skin_border.png);
            background-repeat: no-repeat;
            padding-top: 5px;
            padding-left: 3px;
            margin-top: 30px;
        }
        #left2{
            width: 700px;
            height: 160px;
            border: 1px red dashed;
            margin-top: 30px;
            background: url(images/ex_func_title.png);
            background-repeat: no-repeat;
        }
        #left2 li{
            width: 90px;
            height: 130px;
            margin-top: 24px;
            margin-left: 10px;
            float: left;
        }
        .left2-1{
            width: 90px;
            height: 90px;
            margin-left: 10px;
            float: left;
        }
        .left2-2{
            width: 76px;
            height: 23px;
            margin-left: 10px;
        }
        #left3{
            width: 700px;
            height: 150px;
            margin-top: 30px;
            background: url(images/dict_show_title.png);
            background-repeat: no-repeat;
        }
        #left3-1 {
            width: 700px;
            height: 120px;
            margin-top: 30px;
            margin-left: 10px;
            float: left;
        }
        #left3-1 li{
            float: left;
            margin-left: 10px;
        }
        .left3-1-1{
            text-align: center;
            color:#999;
            font-size: 13px;
        }
        #right1{
            width: 260px;
            height: px;
            border: 1px red dashed;
            background:url(images/new_activity.png);
            background-repeat: no-repeat;
            margin-top: 30px;
        }
        #right1 li{
            width: 230px;
            height: 18px;
            background: url(images/activity_bg.png);
            background-position: 0 6px;
            padding: 10px 25px;
            background-repeat: no-repeat;
        }
        #right1 li:nth-of-type(odd){
            color: #f00;
        }
        #right1 li:nth-of-type(even){
            color: #999;
        }
        #bottom{
            width: 1000px;
            height: 50px;
            text-align: center;
            margin: 0 auto;
            color: #999;
            margin-top: 10px;
            float: left;
        }
    </style>
</head>
<body>
    <div id="wrap">
        <div id="head">
            <div id="head1">
                <ul>
                    <li>
                        <div class="head1-1">输入法手机版</div>
                        <div class="head1-2"><img src="images/separator.png" alt=""></div>
                    </li>
                    <li>
                        <div class="head1-1">输入法Mac版</div>
                        <div class="head1-2"><img src="images/separator.png" alt=""></div>
                    </li>
                    <li>
                        <div class="head1-1">输入法企业版</div>
                        <div class="head1-2"><img src="images/separator.png" alt=""></div>
                    </li>
                    <li>
                        <div class="head1-1">输入法Linux版</div>
                        <div class="head1-2"><img src="images/separator.png" alt=""></div>
                    </li>
                    <li>
                        <div class="head1-1">五笔输入法</div>
                        <div class="head1-2"><img src="images/separator.png" alt=""></div>
                    </li>
                    <li>
                        <div class="head1-1">输入法开发平台</div>
                        <div class="head1-2"><img src="images/separator.png" alt=""></div>
                    </li>
                </ul>
            </div>
            <div id="head2">
                <div id="head2-1">
                    <img src="images/logo.png" alt="">
                </div>
                <div id="head2-2">
                    <input type="text" value="找皮肤.." style="color: #999;" 
                    width="292px" height="28px" onfocus="this.value=''">
                </div>
            </div>
            <div id="head3">
                <ul>
                    <li><span>首页</span></li>
                    <li><span>皮肤</span></li>
                    <li><span>词库</span></li>
                    <li><span>皮肤表情开放平台</span></li>
                    <li><span>帮助</span></li>
                    <li><span>升级日志</span></li>
                </ul>
            </div>
        </div>
        <!--head结束-->
        <div id="banner">
            <div id="banner1">
                <span style="color: #999;">更新：2024-06-20</span>&nbsp;&nbsp;&nbsp;
                <span style="color: #e94f0d;">新版本特性</span>
            </div>
            <div id="banner2"></div>
        </div>
        <!--banner结束-->
        <div id="body">
            <div id="left">
                <div id="left1">
                    <div style="width: 334px;float: left;margin-left: 10px;">
                        <div class="left1-1">
                            <img src="images/14316772942017_former.jpg" alt="">
                            <p style="font-size: 14px;margin-top: 6px;color: #999;">
                                [左文字]男神快来壁咚我
                            </p>
                        </div>
                        <div class="left1-1">
                            <img src="images/14309736469777_former.jpg" alt="">
                            <p style="font-size: 14px;margin-top: 6px;color: #999;">
                                复仇者联盟雷神
                            </p>
                        </div>
                        <div class="left1-1">
                            <img src="images/14316722892549_former.jpg" alt="">
                            <p style="font-size: 14px;margin-top: 6px;color: #999;">
                                【景诺】那时花开·素色
                            </p>
                        </div>
                    </div>
                    <div style="width: 334px;float: left;margin-left: 10px;">
                        <div class="left1-1">
                            <img src="images/14316719802489_former.png" alt="">
                            <p style="font-size: 14px;margin-top: 6px;color: #999;">
                                我们毕业了
                            </p>
                        </div>
                        <div class="left1-1">
                            <img src="images/14316581059324_former.jpg" alt="">
                            <p style="font-size: 14px;margin-top: 6px;color: #999;">
                                晴天-刀刀感受风
                            </p>
                        </div>
                        <div class="left1-1">
                            <img src="images/14316771075561_former.png" alt="">
                            <p style="font-size: 14px;margin-top: 6px;color: #999;">
                                【初久】时光尽头
                            </p>
                        </div>
                    </div>
                </div>
                <div id="left2">
                    <ul>
                        <li>
                            <div class="left2-1">
                                <img src="images/id_1.png" alt="" >
                            </div>
                            <div class="lefft2-2">
                            </div>
                        </li>
                        <li>
                            <div class="left2-1">
                                <img src="images/id_1.png" alt="">
                            </div>
                            <div class="lefft2-2" style="background: url(images/down_ex_func.png);
                                background-position: -76px 0;">
                            </div>
                        </li>
                        <li>
                            <div class="left2-1">
                                <img src="images/id_1.png" alt="">
                            </div>
                            <div class="lefft2-2" style="background: url(images/down_ex_func.png);
                                background-position: -152x 0;">
                            </div>
                        </li>
                        <li>
                            <div class="left2-1">
                                <img src="images/id_1.png" alt="">
                            </div>
                            <div class="lefft2-2"style="background: url(images/down_ex_func.png);
                                background-position: -228px 0;">
                            </div>
                        </li>
                        <li>
                            <div class="left2-1">
                                <img src="images/id_1.png" alt="">
                            </div>
                            <div class="lefft2-2" style="background: url(images/down_ex_func.png);
                                background-position: -304px 0;">
                            </div>
                        </li>
                        <li>
                            <div class="left2-1">
                                <img src="images/id_1.png" alt="">
                            </div>
                            <div class="lefft2-2" style="background: url(images/down_ex_func.png);
                                background-position: -380px 0;">
                            </div>
                        </li>
                    </ul>
                </div>
                <div id="left3">
                    <div id="left3-1">
                        <ul>
                            <li>
                                <img src="images/list_1.png" alt="">
                                <div class="left3-1-1">网络流行</div>
                            </li>
                            <li>
                                <img src="images/list_2.png" alt="">
                                <div class="left3-1-1">植物词汇</div>
                            </li>
                            <li>
                                <img src="images/list_3.png" alt="">
                                <div class="left3-1-1">诗词名句</div>
                            </li>
                            <li>
                                <img src="images/list_4.png" alt="">
                                <div class="left3-1-1">股票基金</div>
                            </li>
                            <li>
                                <img src="images/list_5.png" alt="">
                                <div class="left3-1-1">地质地理</div>
                            </li>
                            <li>
                                <img src="images/list_6.png" alt="">
                                <div class="left3-1-1">中国医药</div>
                            </li>
                        </ul>
                    </div>
            </div>
            </div>
            <!--left结束-->
            <div id="right">
                <div id="right1">
                    <ul>
                        <li>搜狗输入法发布指令</li>
                        <li>新词特色发布指令</li>
                        <li>萌萌的输入法指令</li>
                        <li>想做皮肤法发布指令</li>
                    </ul>
                </div>
                <div id="right2">
                    <div><img src="images/focus_ewn.png" alt=""></div>
                    <div><img src="images/download_list.2.5.2.jpg" alt=""></div>
                    <div><img src="images/skin_pic.jpg" alt=""></div>
                </div>
            </div>
        <!--body结束-->
        <div id="bottom">
            网站地图-企业推广-各种输入法-招聘人才<br/>
            @2024-06 sougou.com 11111-202号
        </div>
    </div>

</body>
</html>